<template>
  <div class="AppContainer">
    <h1>app根组件你好</h1>
    <!-- <register></register>
    <login></login>
    <Shuiguo></Shuiguo>
    <User></User> -->
    <h1>webpack</h1>
    <router-link to="/Login">登录</router-link>
    <router-link to="/Register">注册</router-link>
    <router-link to="/Shuiguo">水果</router-link>
    <router-link to="/Shucai">蔬菜</router-link>
    <router-link to="/User">用户</router-link>
    <keep-alive>
      <router-view></router-view>
    </keep-alive>
  </div>
</template>

<script>
//导入组件
// import login from '@/components/login.vue';
import Register from "@/components/Register.vue";
import Login from "@/components/Login.vue";
import Shuiguo from "@/components/Shuiguo.vue";
import Shucai from "@/components/Shucai.vue";
import User from "@/components/User.vue";
export default {
  name: "App",
  components: {
    Register,
    Login,
    Shuiguo,
    User,
    Shucai,
  },
};
</script>

<style lang="scss" scoped>
/*当前路由高亮显示：*/
.router-link-active {
  background: black;
  color: #fff;
}
@import "./assets/scss/common.scss";
</style>
